<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path;
%>
<c:set var="ctx" value="<%=basePath %>"/>
<c:set var="js" value="${ctx}/static/js"/>
<c:set var="css" value="${ctx}/static/css"/>
<c:set var="img" value="${ctx}/static/images"/>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="telephone=yes" name="format-detection">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta name="full-screen" content="yes">
    <meta name="x5-fullscreen" content="true">

    <title>活动详情</title>
    <link rel="stylesheet" type="text/css" href="${css}/app/common.css">
    <link rel="stylesheet" type="text/css" href="${css}/app/createActive.css">
    <script type="text/javascript" src="${js}/easyui1.4.1/jquery.min.js?version=${jsVersion}"></script>
    <script type="text/javascript" src="${js}/config.js?version=${jsVersion}"></script>
</head>
<body style="background: #F4F4F4">
<div class="createActive">
    <div class="createActive_top">
        <div class="banner_img">
            <img src="">
        </div>
        <div class="active_title">
            <span class="title">${title}</span>
            <c:if test="${not empty types}">
                <span class="tags">${types}</span>
            </c:if>

            <span class="people_set"><b>${joinCount}</b>/${limitCount}  人</span>
        </div>
    </div>

    <div class="createActive_main">
        <div class="time_box main_item">
            <div class="icon">
                <i></i>
            </div>
            <div class="title">
                <p>时间</p>
            </div>
            <div class="data_box">
                <h6>${startTime}</h6>
                <h6>到 ${endTime}</h6>
            </div>
        </div>
        <div class="main_item address_box">
            <div class="icon">
                <i></i>
            </div>
            <div class="title">
                <p>活动地点</p>
            </div>
            <div class="data_box">
                <p>${address}</p>
            </div>
        </div>
        <div class="main_item feiyong_box">
            <div class="icon">
                <i></i>
            </div>
            <div class="title">
                <p>费用</p>
            </div>
            <div class="data_box">
                <p>${cost}</p>
            </div>
        </div>
        <div class="main_item people_num">
            <div class="icon">
                <i></i>
            </div>
            <div class="title">
                <p>他们也参与了</p>
            </div>
            <div class="data_box">
                <p>${joinCount}人<span></span></p>
            </div>
        </div>
    </div>
    <div class="createActive_detail">
        <div class="title">
            <h2>活动详情</h2>
        </div>
        <div class="detail_text">
            <p>${content}</p>
        </div>
    </div>

    <div class="bottom_btn">
        <a href="javascript:void(0)" class="btn">群聊</a>
    </div>
</div>
</body>
<script type="text/javascript">
    $(function () {
        // 图片列表
        var imgs = '${images}', image;
        if (!!imgs) {
            if (imgs.indexOf(",")) {
                image = imgs.split(",")[0];
            } else {
                image = imgs;
            }
            $(".banner_img img").attr("src", image);
        }
    });
</script>
</html>